<div class="row">
    <div class="col-md-4" ng-controller="chartJs1DCtrl">
        <div ba-panel ba-panel-title="Pie" ba-panel-class="with-scroll ">
            <div class="chartjs-canvas-holder-first-row">
                <canvas id="pie" class="chart chart-pie"
                       chart-options="options" chart-data="data" chart-labels="labels"
                        chart-click="changeData">
                </canvas>
            </div>
        </div>
    </div>
    <div class="col-md-4" ng-controller="chartJs1DCtrl">
        <div ba-panel ba-panel-title="Doughnut" ba-panel-class="with-scroll ">
            <div class="chartjs-canvas-holder-first-row">
                <canvas id="doughnut" chart-options="options" class="chart chart-doughnut"
                        chart-data="data" chart-labels="labels" chart-click="changeData">
                </canvas>
            </div>
        </div>
    </div>
    <div class="col-md-4" ng-controller="chartJs1DCtrl">
        <div ba-panel ba-panel-title="Polar" ba-panel-class="with-scroll ">
            <div class="chartjs-canvas-holder-first-row">
                <canvas id="polar-area" class="chart chart-polar-area"
                        chart-data="data" chart-options="options" chart-labels="labels"
                        chart-click="changeData">
                </canvas>
            </div>
        </div>
    </div>
</div>

<div class="row ">
    <div class="col-md-6" ng-controller="chartJsWaveCtrl">
        <div ba-panel ba-panel-title="Animated Radar" ba-panel-class="col-eq-height">
            <div class="chartjs-canvas-holder-second-row">
                <canvas id="waveLine" class="chart chart-radar" chart-data="[data]" chart-labels="labels"></canvas>
            </div>

        </div>
    </div>
    <div class="col-md-6" ng-controller="chartJsWaveCtrl">
        <div ba-panel ba-panel-title="Animated Bars" ba-panel-class="col-eq-height">
            <div class="chartjs-canvas-holder-second-row">
                <canvas id="waveBars" class="chart chart-bar" chart-data="[data]" chart-labels="labels"></canvas>
            </div>
        </div>
    </div>
</div>


<div class="row ">
    <div class="col-lg-4 col-md-6" ng-controller="chartJs2DCtrl">
        <div ba-panel ba-panel-title="Radar" ba-panel-class="with-scroll ">
            <div class="chartjs-canvas-holder-third-row">
                <canvas id="radar" class="chart chart-radar" chart-series="series" chart-data="data"
                        chart-labels="labels" chart-click="changeData">
                </canvas>
            </div>
        </div>
    </div>
    <div class="col-lg-4 col-md-6" ng-controller="chartJs2DCtrl">
        <div ba-panel ba-panel-title="Line" ba-panel-class="with-scroll ">
            <div class="chartjs-canvas-holder-third-row">
                <canvas id="line" class="chart chart-line" chart-data="data" chart-labels="labels"
                        chart-series="series" chart-click="changeData"></canvas>
            </div>
        </div>
    </div>
    <div class="col-lg-4 col-md-12" ng-controller="chartJs2DCtrl">
        <div ba-panel ba-panel-title="Bars" ba-panel-class="with-scroll ">
            <div class="chartjs-canvas-holder-third-row">
                <canvas id="bar" class="chart chart-bar"
                        chart-data="data" chart-labels="labels" chart-series="series" chart-click="changeData" chart-update="updateC">
                </canvas>
            </div>
        </div>
    </div>
</div>


